<template>
  <borderbox
    :bordermodel="bordermodel"
    :height="vheight"
    :title="title"
    :iconclass="iconclass"
    :iconcolor="iconcolor"
    :titlecolor="titlecolor"
    :decorationmodel="decorationmodel"
  >
    <dv-flyline-chart-enhanced
      v-if="key > 0"
      ref="charts"
      :id="controlid"
      :config="config"
      :style="{
        margin: '3px',
        float: 'left',
        width: '100%',
        height: title === '' ? '100% ' : 'calc(100% - 40px)'
      }"
    />
  </borderbox>
</template>
<script>
/* eslint-disable */
import elementResizeDetectorMaker from 'element-resize-detector'
import borderbox from '@/components/borderbox/index.vue'
export default {
  name: 'flylinechart',
  components: { borderbox },
  watch: {
    height(val) {
      if (val !== undefined && val !== '') {
        if (typeof val === 'number') {
          this.vheight = val + 'px'
          this.eheight = val - 30 + 'px'
        } else if (this.isNumber(val)) {
          this.vheight = val + 'px'
          this.eheight = parseInt(val) - 30 + 'px'
        } else {
          this.vheight = val
        }
      }
    }
  },
  props: [
    'options',
    'height',
    'bordermodel',
    'title',
    'iconclass',
    'iconcolor',
    'titlecolor',
    'decorationmodel'
  ],
  mounted() {
    if (this.height !== undefined && this.height !== '') {
      if (typeof this.height === 'number') {
        this.vheight = this.height + 'px'
        this.eheight = this.height - 30 + 'px'
      } else if (this.isNumber(this.height)) {
        this.vheight = this.height + 'px'
        this.eheight = parseInt(this.height) - 30 + 'px'
      } else {
        this.vheight = this.height
      }
    }
    const _this = this
    const erd = elementResizeDetectorMaker()
    erd.listenTo(document.getElementById(this.controlid), () => {
      _this.resize()
    })
  },
  created() {},
  methods: {
    isNumber(val) {
      const regPos = /^\d+(\.\d+)?$/ // 非负浮点数
      const regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/ // 负浮点数
      if (regPos.test(val) || regNeg.test(val)) {
        return true
      }
      return false
    },
    resize() {
      this.$nextTick(() => {
        if (this.$refs.charts.autoResizeMixinInit !== undefined) {
          this.$refs.charts.autoResizeMixinInit()
        }
      })
      this.key++
    }
  },
  data() {
    return {
      controlid:
        'div' + Date.parse(new Date()) + '_' + Math.ceil(Math.random() * 99999),
      vheight: '230px',
      eheight: '200px',
      key: 1,
      config: {
        points: [
          {
            name: '郑州',
            coordinate: [0.48, 0.35]
          },
          {
            name: '新乡',
            coordinate: [0.52, 0.23]
          },
          {
            name: '焦作',
            coordinate: [0.43, 0.29]
          },
          {
            name: '开封',
            coordinate: [0.59, 0.35]
          },
          {
            name: '许昌',
            coordinate: [0.53, 0.47]
          },
          {
            name: '平顶山',
            coordinate: [0.45, 0.54]
          },
          {
            name: '洛阳',
            coordinate: [0.36, 0.38]
          },
          {
            name: '周口',
            coordinate: [0.62, 0.55]
          },
          {
            name: '漯河',
            coordinate: [0.56, 0.56]
          },
          {
            name: '南阳',
            coordinate: [0.37, 0.66]
          },
          {
            name: '信阳',
            coordinate: [0.55, 0.81]
          },
          {
            name: '驻马店',
            coordinate: [0.55, 0.67]
          },
          {
            name: '济源',
            coordinate: [0.37, 0.29]
          },
          {
            name: '三门峡',
            coordinate: [0.2, 0.36]
          },
          {
            name: '商丘',
            coordinate: [0.76, 0.41]
          },
          {
            name: '鹤壁',
            coordinate: [0.59, 0.18]
          },
          {
            name: '濮阳',
            coordinate: [0.68, 0.17]
          },
          {
            name: '安阳',
            coordinate: [0.59, 0.1]
          }
        ],
        lines: [
          {
            source: '新乡',
            target: '郑州'
          },
          {
            source: '焦作',
            target: '郑州'
          },
          {
            source: '开封',
            target: '郑州'
          },
          {
            source: '许昌',
            target: '郑州'
          },
          {
            source: '平顶山',
            target: '郑州'
          },
          {
            source: '洛阳',
            target: '郑州'
          },
          {
            source: '周口',
            target: '郑州'
          },
          {
            source: '漯河',
            target: '郑州'
          },
          {
            source: '南阳',
            target: '郑州'
          },
          {
            source: '信阳',
            target: '郑州'
          },
          {
            source: '驻马店',
            target: '郑州'
          },
          {
            source: '济源',
            target: '郑州'
          },
          {
            source: '三门峡',
            target: '郑州'
          },
          {
            source: '商丘',
            target: '郑州'
          },
          {
            source: '鹤壁',
            target: '郑州'
          },
          {
            source: '濮阳',
            target: '郑州'
          },
          {
            source: '安阳',
            target: '郑州'
          }
        ],
        bgImgSrc: 'http://datav.jiaminghi.com/img/flylineChart/map.jpg'
      }
    }
  }
}
</script>
